import React from 'react';
import base from '../util/base';
import * as Common from '../util/common';
import { doSubmitForm } from '../util/submit';
import { observer } from 'mobx-react';
import { Tools,Icon,Checkbox } from 'weaver-mobile';
import * as Util from '../util/continuationProcessUtil';

const CheckboxItem = Checkbox.CheckboxItem;
const getLabel = Tools.getLabel;


@observer
class Main extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
          saveData : 1
        };
    }

    render() {
        const {continuationProcessInfo} = this.props;
        const {currentIndex, counts} = continuationProcessInfo;
        let spanLabel = getLabel(517273, "第{current}条（共{counts}条）");
        spanLabel = spanLabel.replace(/{current}/, currentIndex + 1);
        spanLabel = spanLabel.replace(/{counts}/, counts);
        return (
          <div className='wf-continuationProcess-div'>
              <div className="wf-continuationProcess-title">
              <span>{spanLabel}</span>
                <div className="wf-continuationProcess-title-pageSwitch">
                  <Icon type={"home-page-1"} size={"xxs"} className={(currentIndex != 0) ? "first" : "first disabled"} onClick={() => { (currentIndex != 0) && this.switchRequestNeedConfirm('first')}}/>
                  <span className={(currentIndex != 0) ? "prePage" : "pre-disabled"} onClick={() => { (currentIndex != 0) && this.switchRequestNeedConfirm('pre')}}>{getLabel(515115, "上一条")}</span>
                  <span className={(currentIndex != counts - 1) ? "nextPage" : "disabled"} onClick={() => { (currentIndex != counts - 1) && this.switchRequestNeedConfirm('next')}}>{getLabel(515116, "下一条")}</span>
                  <Icon type={"tail-page"} size={"xxs"} className={(currentIndex != counts - 1) ? "last" : "last disabled"} onClick={() => {(currentIndex != counts - 1) && this.switchRequestNeedConfirm('last')}}/>
                </div>
              </div>
          </div>
        )
      }


      //连续处理切换流程（需确认）
    switchRequestNeedConfirm = (type) => {
      const {existChangeFormData} = base.wfLayoutStore;
      const {commonParam} = base.wfGlobalStore;
      if(existChangeFormData) {
          const that = this;
          const defaultChecked =  this.state.saveData == 1 ? true : false;
          Common.showConfirm({
              title: <div>
                      <div>{getLabel(528822, '流程表单信息已被手动或系统自动修改，确定要离开当前页面吗？')}</div>
                      { commonParam.isviewonly == 0 && 
                        <CheckboxItem 
                          style={{paddingTop : '20px'}}
                          key="1" 
                          defaultChecked={defaultChecked}
                          onChange={(i) => this.setState({saveData : i.target.checked ? 1 : 0})}
                        >
                          {getLabel(528821, '离开时保存当前数据')}
                        </CheckboxItem>
                      }
                    </div>,
              okEvent: () => {
                  if(that.state.saveData == 1 && commonParam.isviewonly == 0) {
                    doSubmitForm({actiontype:"requestOperation", src:"save", closePage:false, continuationSwitchType : type});
                  } else {
                    Util.switchRequest(type);
                  }
              },
              cancelEvent: () => {},
          });
      } else {
          Util.switchRequest(type);
      }
    }
}

export default Main;